<%--
  Created by IntelliJ IDEA.
  User: BluceYoung
  Date: 2020/12/2
  Time: 18:58
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<jsp:include page="temp/login_head.jsp"></jsp:include>
<form id="regForm" action="${pageContext.request.contextPath}/register.html" method="post">
    <h1>用户注册</h1>
    <div>
        <input type="text" name="loginMail" class="form-control" placeholder="注册邮箱" required=""/>
    </div>
    <div>
        <input type="password" name="pwd" maxlength="20" class="form-control" placeholder="密码 6-20位" required=""/>
    </div>
    <div>
        <input type="password" name="pwd2" class="form-control" maxlength="20" placeholder="重复密码" required=""/>
    </div>
    <div>
        <button type="submit" class="btn btn-default">注册</button>
        <a class="reset_pass" href="#">忘记密码?</a>
    </div>
    <div class="clearfix"></div>
    <div class="separator">
        <p class="change_link">New to site?
            <a href="#signup" class="to_register"> Create Account </a>
        </p>
        <div class="clearfix"></div>
        <br/>
        <div>
            <h1><i class="fa fa-paw"></i> Gentelella Alela!</h1>
            <p>©2016 All Rights Reserved. Gentelella Alela! is a Bootstrap 3 template. Privacy and Terms</p>
        </div>
    </div>
</form>
<jsp:include page="temp/login_foot.jsp"></jsp:include>

<script type="text/javascript">
    var msg = "${msg}";
    if (msg.length > 0) {
        alert(msg)
        if(msg="注册成功"){
            window.location="${pageContext.request.contextPath}/login.html";
        }
    }

    $(function () {
//表单提交时触发
        $("#regForm").submit(function () {
//邮箱格式
            var exp = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
            if (!exp.test($("input[name='loginMail']").val())) {
                alert("邮箱格式不正确")
                return false;//阻止提交
            }
//密码长度
            if ($("input[name='pwd']").val().length < 6) {
                alert("密码至少要6位")
                return false;
            }
//两次密码是否一致
            if ($("input[name='pwd']").val() != $("input[name='pwd2']").val()) {
                alert("两次密码不一致")
                return false;
            }
            return true;
        })
    })
</script>